<template>
	<view class="content">
		<view class="match-top-box">
			<view class="match-title">尊敬的委托人：</view>
			<view class="match-txt">您好！很荣幸接受您的委托，法务专员正在审查您的订单，稍后将尽快与您联系。我们将全心全意为您提供优质的服务，感谢您的信任与支持！</view>
			<!-- <view class="match-image-txt">
				<view class="txt-left">
					<view class="image-wrapper"><image src="@/static/img/warning.png" mode="aspectFit"></image></view>
				</view>
				<view class="txt-right red">请注意虚拟手机号来电，请勿拦截或拒接</view>
			</view>
			<view class="match-image-txt">
				<view class="txt-left">
					<view class="image-wrapper"><image src="@/static/img/warning.png" mode="aspectFit"></image></view>
				</view>
				<view class="txt-right red">请确认您的手机号与您现在登录本软件的账号一致，否则将无法拨打或接听虚拟电话</view>
			</view> -->
			<view class="service-list">
				<button class="service-item active" @click="$refs.telephoneFawu.$refs.popupTel.open()">联系法务专员</button>
				<button class="service-item active" :disabled="isClientServiceOk || isSpecialistServiceOk" @click="$refs.popupServiceOk.open">法务服务完成</button>
				<button
						class="service-item active"
						:disabled="isClientServiceOk || isSpecialistServiceOk"
						@click="jump('/pages/client/user/to-cancel', { money: info.order.money, order_id: order_id,pay_type:info.order.pay_type })"
				>
					取消订单
				</button>
				<button class="service-item active flex1" v-if="isClientServiceOk" @click="$refs.telephoneFawu.$refs.popupTel.open()">催促法务专员确认完成</button>
				<button class="service-item active flex1" v-if="isClientServiceOk" style="margin-right: 0;" @click="$refs.popupCancelApply.open">取消申请</button>
			</view>
			<template v-if="isSpecialistServiceOk">
				<view class="service-list">
					<button class="service-item active flex1" @click="$refs.popupSureServiceOk.open()">确认法务服务完成</button>
					<button class="service-item active flex1" style="margin-right: 0;" @click="$refs.popupNoSureServiceOk.open()">退回申请</button>
				</view>
			</template>
		</view>
		<order-telephone name="法务专员" :phoneNumber="info.order.fawu_mobile" ref="telephoneFawu"
						 v-if="info.order.fawu_mobile"></order-telephone>
		<!-- 案件主体信息 -->
		<order-case :info="info" :key="new Date().getTime() + 'case'" :statused="statused" :iswancheng="false" @toedit="toedit">
<!--			<template slot="case-edit">-->
<!--				<text class="gray" style="color: #f20000;">(请叫一下法务专员为您填写)</text>-->
<!--			</template>-->
		</order-case>
		<!-- 订单详情  -->
		<order-detail ref="orderAllDetail" :info="info.order" :isTan="true">
			<template slot="detail-edit">
				<text class="gray" style="color: #f20000;">（如需更改，请叫一下法务专员帮您修改）</text>
        <view class="od-item" style="padding:18rpx 0 0 0;width: 100%;" v-if="info.order.status==18">
          <button class="service-item-btn" @click="$refs.returnChange.open">退回重新更改</button>
          <button  class="service-item-btn" style="margin-right: 0;" @click="$refs.agreeChange.open">同意更改</button>
        </view>
			</template>
		</order-detail>
		<!-- 确认更改弹出层 -->
		<uni-popup ref="agreeChange" type="dialog">
			<uni-popup-dialog
					type="info"
					okTxt="是"
					cancleTxt="否"
					content="我确认更改订单，请帮我尽快匹配律师"
          contentsubtitle="(订单更改后，如需付款的，请及时支付。原订单已付款项将原路退回，您可在“我的”-“余额”里查看)"
					:before-close="true"
					@confirm="orderAgree"
					@close="closePop('agreeChange')"
			></uni-popup-dialog>
		</uni-popup>
		<!-- 退回更改弹出层 -->
		<uni-popup ref="returnChange" type="dialog">
			<uni-popup-dialog
					type="info"
					okTxt="是"
					cancleTxt="否"
					content="我要退回重新更改"
					:before-close="true"
					@confirm="changeOrder"
					@close="closePop('returnChange')"
			></uni-popup-dialog>
		</uni-popup>
		<!-- 支付弹出层 -->
		<uni-popup ref="popupWantPay">
			<service-popup-pay title="我要付款" btnText="我要支付" @closePop="closePop('popupWantPay')" @confirmPay="confirmPay">
				<template slot="payOption">
					<view class="od-item marginbottom20" style="display:flex;align-items: center">
						<view class="item-tip" style="display:flex;align-items: center"><text>付款金额</text> <text class="red" style="margin-top:10rpx">*</text></view>
						<view class="item-right">
							<view class="item-txt red">￥{{ info.order.money }}</view>
						</view>
					</view>
				</template>
			</service-popup-pay>
		</uni-popup>

		<!-- 服务完成弹出层 -->
		<uni-popup ref="popupServiceOk" type="dialog">
			<uni-popup-dialog
					type="info"
					okTxt="是"
					cancleTxt="否"
					content="我已与法务专员确认法务服务完成，以便帮我尽快匹配律师。"
					:before-close="true"
					@confirm="confirmServiceOk"
					@close="closePop('popupServiceOk')"
			></uni-popup-dialog>
		</uni-popup>
		<!-- 确认服务完成弹出层 -->
		<uni-popup ref="popupSureServiceOk" type="dialog">
			<uni-popup-dialog
					type="info"
					okTxt="是"
					cancleTxt="否"
					content="我确认法务服务已经完成"
					:before-close="true"
					@confirm="sureServiceOk(1, 'popupSureServiceOk')"
					@close="closePop('popupSureServiceOk')"
			></uni-popup-dialog>
		</uni-popup>
		<!-- 不确认服务完成弹出层 -->
		<uni-popup ref="popupNoSureServiceOk" type="dialog">
			<uni-popup-dialog
					type="info"
					okTxt="是"
					cancleTxt="否"
					content="确认退回申请"
					:before-close="true"
					@confirm="sureServiceOk(2, 'popupNoSureServiceOk')"
					@close="closePop('popupNoSureServiceOk')"
			></uni-popup-dialog>
		</uni-popup>
		<!-- 取消申请 -->
		<uni-popup ref="popupCancelApply" type="dialog">
			<uni-popup-dialog
					type="info"
					okTxt="是"
					cancleTxt="否"
					content="确认取消申请"
					:before-close="true"
					@confirm="confirmCancelApply"
					@close="closePop('popupCancelApply')"
			></uni-popup-dialog>
		</uni-popup>
		<!-- 全局通用组件 -->
		<law-common ref="lawCommon"></law-common>
	</view>
</template>

<script>
	import { mixin } from '@/common/mixins/specialist_order_state.js';
	import { share_coupon } from '@/common/mixins/share_coupon.js';
	export default {
		mixins: [mixin, share_coupon],
		data() {
			return {
				info: {
					order: {}
				},
				order_id: '',
				infoLawyer: {},
        statused:''
			};
		},
		created() {
			window.payOk = this.payOk;
		},
		onLoad(params) {
      if (params.status) {
        this.statused = params.status;
      }
			if (params.order_id) {
				this.order_id = params.order_id;
				this.init();
        this.$refs.agreeChange.open()
			}
		},
		onShow(){
			if(this.order_id){
				this.init();
			}
		},
		methods: {
      // 跳转编辑页面
      toedit(type){

        this.jump('/pages/specialist/user/service-edit', {order_id: this.info.order.id,type:type,usertype:'2'});

      },
			async changeOrderInfo(){
				let formData = {
					id: this.order_id,
					token: uni.getStorageSync('token')
				};
				let res = await this.$api('index.userSureEdit', formData);
				this.init()
			},
			async confirmPay(payMethod) {
				let formDataPay = {
					order_id: this.order_id,
					payMethod: payMethod,
					pay_type: 1
				};
				let resPay = await this.$pay(formDataPay);
				if (resPay == 1) {
					this.changeOrderInfo()
				}
				this.$refs.popupWantPay.close();
			},
			payOk(res) {
				// 安卓0 支付成功，-1 支付失败， -2取消支付
				if (res == '0') {
					this.$refs.popupWantPay.close();
				}
			},
			async orderAgree(){
				this.closePop('agreeChange')
				// 只有在自费的产品里才需要弹出支付
				if(this.info.order.price_type == '自费' && this.info.order.offer != '还魂马' && this.info.order.money_type != '先用后付 无忧付'){
					this.$refs.popupWantPay.open()
				}else{
					this.changeOrderInfo()
				}

			},
			async changeOrder(){
				let formData = {
					id: this.order_id,
					token: uni.getStorageSync('token')
				};
				let res = await this.$api('index.userBackEdit', formData);
				this.$refs.returnChange.close();
				this.init()
			},
			async init() {
				let formData = {
					id: this.order_id,
					token: uni.getStorageSync('token')
				};
				let res = await this.$api('index.orderDetail', formData);
				this.info = res.data;
        console.log("================this.info ,",this.userInfo);
				this.getOrderState(this.info);
			},
			async confirmServiceOk() {
				let formData = {
					id: this.order_id,
					token: uni.getStorageSync('token')
				};
				let res = await this.$api('index.u_sure_legal', formData);
				if (res.code == 1) {
					this.isClientServiceOk = true;
					this.$refs.popupServiceOk.close();
				}
			},
			async confirmCancelApply() {
				let formData = {
					id: this.order_id,
					token: uni.getStorageSync('token')
				};
				let res = await this.$api('index.fawuback', formData);
				if (res.code == 1) {
					//this.isClientServiceOk = true;
					this.$refs.popupCancelApply.close();
					this.init();
				}
			},
			async sureServiceOk(status, pop) {
				let formData = {
					id: this.order_id,
					token: uni.getStorageSync('token'),
					status: status
				};
				let res = await this.$api('index.u_sure_legal_over', formData);
				if (res.code == 1) {
					if (pop == 'popupSureServiceOk') {
						this.closePop('popupSureServiceOk');
						this.replace('/pages/client/user/match', {
							order_id: this.order_id
						});
					} else if (pop == 'popupNoSureServiceOk') {
						this.closePop('popupNoSureServiceOk');
						this.isClientServiceOk = false;
						this.isSpecialistServiceOk = false;
					}
				}
			},
			async callLaw() {
				let formData = {
					id: this.order_id,
					token: uni.getStorageSync('token')
				};
				let res = await this.$api('index.u_call_legal', formData);
				if (res.code == 1) {
					uni.showToast({
						title: '法力平台已催促法务专员，请稍等片刻。',
						icon: 'none',
						duration:3000,
					});
				}
			},
			urged() {
				uni.showToast({
					title: '请点击按钮“叫一下法务”，谢谢！',
					icon: 'none'
				});
			}
		}
	};
</script>

<style lang="scss">
	.content {
		padding-bottom: 30rpx;
	}

	.ok-box {
		padding: 0;
	}

	.service-list {
		padding-top: 20rpx;
		margin-bottom: -10px;
	}
	.service-item-btn{
		margin-left: 0;
		margin-right: 30rpx;
		margin-top: 10rpx;
		background-color: #FFC801;
		color: #ffffff;
		border: none;
		height: 65rpx;
		line-height: 65rpx;
    width: 50%;
	}
</style>
